<template>
  <!-- 到货验收 新增订单 -->
  <div
    v-loading.fullscreen="allLoading"
    element-loading-text="处理中，请稍等..."
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(255, 255, 255, 0.8)"
  >
    <div class="ccui-navigation">
      <el-button
        size="mini"
        type="primary-icon-medium"
        icon="icon-ccui-return"
        @click="handleBack"
        >返回</el-button
      >
      <div class="ccui-navigation-divider" />
      <!-- 面包屑 -->
      <el-breadcrumb
        class="ccui-navigation-crumbs-container"
        separator-class="el-icon-arrow-right"
      >
        <el-breadcrumb-item
          :to="{ path: '/checkManagement/manage/arrival-check-list' }"
          >供应链管理</el-breadcrumb-item
        >
        <el-breadcrumb-item
          :to="{ path: '/checkManagement/manage/arrival-check-list' }"
          >验收管理</el-breadcrumb-item
        >
        <el-breadcrumb-item
          :to="{ path: '/checkManagement/manage/arrival-check-list' }"
          >验收维护</el-breadcrumb-item
        >
        <!-- <el-breadcrumb-item
          :to="{ path: '/checkManagement/manage/arrival-check-list' }"
          >到货验收
        </el-breadcrumb-item> -->
        <el-breadcrumb-item
          ><span>{{ $route.query.status }}订单验收</span>
          <span
            style="margin-left: 10px; color: #4a4a4a"
            v-if="$route.query.status !== '新增'"
            >{{ ysdname }}</span
          >
        </el-breadcrumb-item>
      </el-breadcrumb>
    </div>

    <div class="ccui-app-container-detail2">
      <div class="center-information ccui-app-container-detail-body">
        <!-- tab -->
        <anchor-jump
          @activeTabName="activeTabName"
          :active="isFocus"
          :tabs="tabs"
        />
        <!-- 基本信息 -->
        <el-form
          v-show="tabLabel === '基本信息'"
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="auto"
          class="demo-ruleForm"
        >
          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="填报单位：">
                <el-input
                  disabled
                  v-model="ruleForm.reportInOrgName"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.reportInOrgName }}</span>
              </el-form-item>
            </el-col>

            <el-col :span="12" :offset="4">
              <el-form-item label="供应商：" prop="supplier">
                <el-input
                  disabled
                  v-model="ruleForm.supplier"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.supplier }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="验收单编号：" prop="acceptanceNumber">
                <el-input
                  disabled
                  type="text"
                  v-model="ruleForm.acceptanceNumber"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.acceptanceNumber }}</span>
              </el-form-item>
            </el-col>

            <el-col :span="12" :offset="4">
              <el-form-item label="验收单名称：" prop="acceptanceName">
                <el-input
                  type="text"
                  v-model="ruleForm.acceptanceName"
                  maxlength="300"
                  show-word-limit
                  v-if="$route.query.status !== '查看'"
                  @blur="handleTrim('acceptanceName')"
                ></el-input>
                <span v-else>{{ ruleForm.acceptanceName }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12" class="relative">
              <el-form-item label="订单编号：" prop="orderNumber">
                <el-input
                  disabled
                  type="text"
                  v-model="ruleForm.orderNumber"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.orderNumber }}</span>
                <el-button
                  v-if="$route.query.status === '新增'"
                  class="chereay"
                  type="single-number"
                  @click="ordervisabled = true"
                  >选择</el-button
                >
                <!-- :disabled="
                    $route.query.status === '查看' ||
                      $route.query.status === '编辑'
                  " -->
              </el-form-item>
            </el-col>
            <el-col :span="12" :offset="4">
              <el-form-item label="订单名称：" prop="orderName">
                <el-input
                  disabled
                  type="text"
                  v-model="ruleForm.orderName"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.orderName }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="司机手机号：" prop="driverPhone">
                <el-input
                  v-model="ruleForm.driverPhone"
                  maxlength="11"
                  show-word-limit
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.driverPhone }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12" :offset="4">
              <el-form-item label="司机姓名：" prop="driverName">
                <el-input
                  v-model="ruleForm.driverName"
                  maxlength="50"
                  show-word-limit
                  v-if="$route.query.status !== '查看'"
                  @blur="handleTrim('driverName')"
                ></el-input>
                <span v-else>{{ ruleForm.driverName }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="供应商联系电话：">
                <el-input
                  disabled
                  type="text"
                  v-model="ruleForm.supplierPhone"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.supplierPhone }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12" :offset="4">
              <el-form-item label="车牌号：" prop="plateNumber">
                <el-input
                  v-model="ruleForm.plateNumber"
                  maxlength="10"
                  show-word-limit
                  v-if="$route.query.status !== '查看'"
                  @blur="handleTrim('plateNumber')"
                ></el-input>
                <span v-else>{{ ruleForm.plateNumber }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="编制日期：" prop="compileDate">
                <el-date-picker
                  disabled
                  type="date"
                  placeholder="选择日期"
                  v-model="ruleForm.compileDate"
                  style="width: 100%"
                  v-if="$route.query.status !== '查看'"
                ></el-date-picker>
                <span v-else>{{ formatDate(ruleForm.compileDate) }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12" :offset="4">
              <el-form-item label="编制人：" prop="compilePeople">
                <el-input
                  disabled
                  v-model="ruleForm.compilePeople"
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.compilePeople }}</span>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row type="flex" justify="center" :gutter="0">
            <el-col :span="12">
              <el-form-item label="验收人：" prop="acceptor">
                <el-input
                  v-model="ruleForm.acceptor"
                  v-if="$route.query.status !== '查看'"
                  @blur="handleTrim('acceptor')"
                ></el-input>
                <span v-else>{{ ruleForm.acceptor }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12" :offset="4">
              <el-form-item label="验收人联系电话：" prop="acceptancePhone">
                <el-input
                  v-model="ruleForm.acceptancePhone"
                  maxlength="11"
                  show-word-limit
                  v-if="$route.query.status !== '查看'"
                ></el-input>
                <span v-else>{{ ruleForm.acceptancePhone }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="备注：" prop="remake">
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.remake"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('remake')"
            ></el-input>
            <span v-else>{{ ruleForm.remake }}</span>
          </el-form-item>
          <el-form-item label="品牌星级：" prop="brandStar">
            <el-rate
              v-model="ruleForm.brandStar"
              style="margin-top: 6px"
              :disabled="$route.query.status == '查看'"
            ></el-rate>
          </el-form-item>
          <el-form-item label="品牌评价说明：" prop="brandState">
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.brandState"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('brandState')"
            ></el-input>
            <span v-else>{{ ruleForm.brandState }}</span>
          </el-form-item>
          <el-form-item label="外观质量星级：" prop="appearanceStar">
            <el-rate
              v-model="ruleForm.appearanceStar"
              style="margin-top: 6px"
              :disabled="$route.query.status == '查看'"
            ></el-rate>
          </el-form-item>
          <el-form-item label="外观质量说明：" prop="appearanceState">
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.appearanceState"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('appearanceState')"
            ></el-input>
            <span v-else>{{ ruleForm.brandState }}</span>
          </el-form-item>
          <el-form-item label="数量星级：" prop="numberStar">
            <el-rate
              v-model="ruleForm.numberStar"
              style="margin-top: 6px"
              :disabled="$route.query.status == '查看'"
            ></el-rate>
          </el-form-item>
          <el-form-item label="数量评价说明：" prop="numberState">
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.numberState"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('numberState')"
            ></el-input>
            <span v-else>{{ ruleForm.numberState }}</span>
          </el-form-item>
          <el-form-item label="物流评价星级：" prop="logisticsEvaluationStar">
            <el-rate
              v-model="ruleForm.logisticsEvaluationStar"
              :disabled="$route.query.status == '查看'"
              style="margin-top: 6px"
            ></el-rate>
          </el-form-item>
          <el-form-item label="物流评价说明：" prop="logisticsEvaluationState">
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.logisticsEvaluationState"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('logisticsEvaluationState')"
            ></el-input>
            <span v-else>{{ ruleForm.logisticsEvaluationState }}</span>
          </el-form-item>
          <el-form-item
            label="物流现场配合度星级："
            prop="logisticsCoordinationStar"
          >
            <el-rate
              v-model="ruleForm.logisticsCoordinationStar"
              style="margin-top: 6px"
              :disabled="$route.query.status == '查看'"
            ></el-rate>
          </el-form-item>
          <el-form-item
            label="物流现场配合度说明："
            prop="logisticsCoordinationState"
          >
            <el-input
              type="textarea"
              maxlength="1000"
              show-word-limit
              v-model="ruleForm.logisticsCoordinationState"
              v-if="$route.query.status !== '查看'"
              @blur="handleTrim('logisticsCoordinationState')"
            ></el-input>
            <span v-else>{{ ruleForm.logisticsCoordinationStar }}</span>
          </el-form-item>
        </el-form>
        <!-- 物资清单 -->
        <inventory
          ref="wuziqingdan"
          v-show="tabLabel === '物资清单'"
          id="wuziqingdan"
          title="物资清单"
          :tableData="tableData"
          :defalutData="defalutWuzi"
          @getWuzi="getWuzi"
        />
        <!-- 附件 -->
        <update
          ref="fujian"
          @yanshou="yanshou"
          @fujian="fujian"
          :defalutFujian="defalutFujian"
          v-show="tabLabel === '附件信息'"
        ></update>
      </div>
    </div>

    <!-- 底部按钮 -->
    <el-bottom-guide v-if="$route.query.status !== '查看'">
      <ul class="ccui-bottom-button">
        <li>
          <el-button type="bottom" icon="icon-ccui-save" @click="save(0)"
            >保存并校验
          </el-button>
        </li>
        <li>
          <el-button type="bottom" icon="icon-ccui-save" @click="save(1)"
            >保存并提交
          </el-button>
        </li>
        <li>
          <el-button type="bottom" icon="icon-ccui-return" @click="handleBack"
            >返回
          </el-button>
        </li>
      </ul>
    </el-bottom-guide>

    <!--  底部导航栏及签名导出  -->
    <bottomGuide
      v-if="$route.query.status === '查看' && this.submitStatus !== 0 && isTrue"
      busiType="102"
      approvalStatus="approvaled"
      exportMethod="get"
      methodGetPageType="exportAcceptanceOrder"
      :curPageId="$route.query.id"
      :businessCode="businessCode"
      @handleBack="handleBack"
    />
    <el-bottom-guide
      v-if="$route.query.status === '查看' && this.submitStatus === 0"
    >
      <ul class="ccui-bottom-button">
        <li>
          <el-button type="bottom" icon="icon-ccui-return" @click="handleBack"
            >返回
          </el-button>
        </li>
      </ul>
    </el-bottom-guide>

    <!-- 订单选择弹框 -->
    <order-check
      v-if="ordervisabled"
      :ordervisabled.sync="ordervisabled"
    ></order-check>
  </div>
</template>

<script>
import orderCheck from "./order-check";
import Inventory from "./inventory.vue";
import update from "../../../components/update.vue";
import { formatNumber } from "@/basa/utils";
import anchorJump from "../../../components/anchor-jump.vue";
import publicComponent from "@/basa/components/public";

import {
  saveAcceptanceCert,
  getAcceptanceCert,
  editAcceptanceCert,
  getOrder
} from "../../../api";
export default {
  name: "order-add",
  data() {
    var Mobile = (rule, value, callback) => {
      var myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
      if (value) {
        if (value.match(myreg)) {
          callback();
        } else {
          this.$showErrorMessage("请输入正确的手机号");
          callback(new Error(rule.message || "请输入正确的手机号"));
        }
      } else {
        callback();
      }
    };
    return {
      isTrue: false,
      exportLoading: null,
      submitStatus: "",
      businessCode: "",
      allLoading: false,
      ysdname: localStorage.getItem("ysdname"),
      downloadUrl: this.$addUrlPerFix(process.env.VUE_APP_BASE_URL),
      tabs: [
        // tab锚点跳转数据
        { name: "jibenxinxi", label: "基本信息" },
        { name: "wuziqingdan", label: "物资清单" },
        { name: "fujian", label: "附件信息" }
      ],
      ordervisabled: false, // 选择框显隐
      isFocus: "jibenxinxi", //选中项
      tabLabel: "基本信息", // 当前tab
      ruleForm: {
        plateNumber: "",
        driverName: "",
        remake: "",
        brandState: "",
        appearanceState: "",
        numberState: "",
        logisticsEvaluationState: "",
        logisticsCoordinationState: "",
        acceptanceType: "按订单验收",
        acceptanceTypeCode: "2",
        acceptanceName: "",
        driverPhone: "",
        acceptor: "",
        brandStar: 5,
        appearanceStar: 5,
        numberStar: 5,
        logisticsEvaluationStar: 5,
        logisticsCoordinationStar: 5,
        businessType: "1",
        acceptancePhone: "" // 验收单名称
      }, // 基本信息表单数据
      wuzi: [], // 物资数据
      defalutWuzi: [],
      defalutFujian: [],
      defalutYanshou: [],
      fujianArr: [],
      yanshouArr: [],
      rules: {
        // 验收人
        acceptor: [
          { required: true, message: "验收人不能为空", trigger: "blur" }
        ],
        // 基本信息表单验证
        acceptanceName: [
          { required: true, message: "验收单名称不能为空", trigger: "blur" }
        ],
        logisticsEvaluationStar: [
          { required: true, message: "物流评价星级不能为空", trigger: "blur" }
        ],
        logisticsCoordinationStar: [
          { required: true, message: "物流现场配合度不能为空", trigger: "blur" }
        ],
        // 编制日期
        compileDate: [
          { required: true, message: "编制日期不能为空", trigger: "blur" }
        ],
        // 编制人
        compilePeople: [
          { required: true, message: "编制人不能为空", trigger: "blur" }
        ],
        // 供应商
        supplier: [
          { required: true, message: "供应商不能为空", trigger: "blur" }
        ],
        // 司机手机号
        driverPhone: [
          {
            validator: Mobile,
            trigger: "blur"
          }
        ],
        // 供应商联系电话
        supplierPhone: [
          {
            validator: Mobile,
            trigger: "blur"
          }
        ],
        // 验收人手机号
        acceptancePhone: [
          {
            required: true,
            message: "验收人联系电话不能为空",
            trigger: "blur"
          },
          {
            validator: Mobile,
            trigger: "blur"
          }
        ]
      },
      tableData: []
    };
  },
  activated() {
    if (
      this.$route.query.status === "查看" ||
      this.$route.query.status === "编辑"
    ) {
      this.getAcceptanceCert();
    } else {
      this.huixian();
    }
    this.$refs["ruleForm"].resetFields();
    this.isFocus = "jibenxinxi"; //选中项
    this.tabLabel = "基本信息"; // 当前tab
  },
  deactivated() {
    this.isTrue = false;
  },
  created() {
    if (
      this.$route.query.status === "查看" ||
      this.$route.query.status === "编辑"
    ) {
      this.getAcceptanceCert();
    } else {
      this.huixian();
    }

    this.tableData = [];
  },
  components: {
    Inventory,
    anchorJump,
    update,
    orderCheck,
    bottomGuide: publicComponent.bottomGuide
  },
  methods: {
    reset() {
      this.$refs["ruleForm"].resetFields();
    },
    // 返回
    handleBack() {
      this.defalutWuzi = [];
      this.$router.push("/checkManagement/manage/arrival-check-list");
    },
    // tabEvent
    activeTabName(label) {
      let labelStr = "";
      switch (label) {
        case "基本信息":
          labelStr = "jibenxinxi";
          break;
        case "物资清单":
          labelStr = "wuziqingdan";
          break;

        case "附件信息":
          labelStr = "fujian";
          break;
      }
      this.isFocus = labelStr;
      this.tabLabel = label;
    },
    // 获取物资数据
    getWuzi(rows) {
      this.wuzi = rows;
    },
    // 验收上传回调
    yanshou(res) {
      this.yanshouArr = res ? res : [];
    },
    // 附件上传回调
    fujian(res) {
      this.fujianArr = res ? res : [];
    },

    // 表单验证定位
    positionFrom() {
      return new Promise((resolve, reject) => {
        this.$refs["ruleForm"].validate(valid => {
          if (valid) {
            resolve(this.ruleForm);
          } else {
            reject({ tabLabel: "基本信息", isFocus: "jibenxinxi" });
            return false;
          }
        });
      });
    },

    // 保存
    async save(submi) {
      let wuziqingdan, fujian;
      try {
        await this.positionFrom();
        wuziqingdan = await this.$refs.wuziqingdan.positionFrom();
        fujian = await this.$refs.fujian.positionFrom();
      } catch (error) {
        this.tabLabel = error.tabLabel;
        this.isFocus = error.isFocus;
        const errorDom = document.body.querySelector(".is-error");
        if (errorDom) {
          errorDom.scrollIntoView();
        }
      }

      if (wuziqingdan !== "成功") return;
      if (fujian !== "成功") return;

      this.ruleForm.submitStatus = submi;
      if (this.wuzi[0]) {
        this.ruleForm.categoryName = this.wuzi[0].categoryName;
        this.ruleForm.categoryCode = this.wuzi[0].categoryCode;
      }

      this.wuzi.forEach((item, index) => {
        // delete this.wuzi[index].uuid;
        item.acceptanceDate = new Date(item.acceptanceDate).getTime();
      });

      let obj = {
        id: this.$route.query.id * 1,
        version: this.ruleForm.version,
        acceptanceCertBO: this.ruleForm,
        acceptanceBillBOList: this.wuzi,
        acceptanceUploadIds: this.yanshouArr,
        otheruploadIds: this.fujianArr,
        isShowPageLoading: true
      };

      if (this.$route.query.status === "编辑") {
        editAcceptanceCert(obj).then(res => {
          this.$message.success(res.data.message);
          this.ruleForm.wuzi = [];
          this.ruleForm.fujian = [];
          this.defalutFujian = [];
          this.defalutWuzi = [];
          this.$refs["ruleForm"].resetFields();
          this.$router.push({
            path: "/checkManagement/manage/arrival-check-list"
          });
        });
      } else {
        saveAcceptanceCert(obj).then(res => {
          this.$message.success(res.data.message);
          this.defalutFujian = [];
          this.defalutWuzi = [];
          this.$refs["ruleForm"].resetFields();
          this.$router.push({
            path: "/checkManagement/manage/arrival-check-list"
          });
        });
      }
    },

    // 查询接口
    getAcceptanceCert() {
      this.allLoading = true;
      getAcceptanceCert({
        id: this.$route.query.id
      }).then(res => {
        const {
          acceptanceCertBO,
          acceptanceBillBOList,
          otherFiles,
          sceneFiles
        } = res.data.data;

        this.businessCode = acceptanceCertBO.acceptanceNumber;
        this.submitStatus = acceptanceCertBO.submitStatus;
        // 供应商编码 无
        this.$set(this.ruleForm, "supplierCode", acceptanceCertBO.supplierCode);
        // 填报单位编码
        this.$set(
          this.ruleForm,
          "reportInOrgId",
          acceptanceCertBO.reportInOrgId
        );
        // 订单主键id
        this.$set(this.ruleForm, "orderId", acceptanceCertBO.orderId);
        // 验收单主键id
        this.$set(this.ruleForm, "id", this.$route.query.id);
        // 版本号
        this.$set(this.ruleForm, "version", acceptanceCertBO.version);
        // 合同ID
        this.$set(this.ruleForm, "contractId", acceptanceCertBO.contractId);
        // 分类名称
        this.$set(this.ruleForm, "categoryName", acceptanceCertBO.categoryName);
        // 供应商ID
        this.$set(
          this.ruleForm,
          "supplierOrgId",
          acceptanceCertBO.supplierOrgId
        );
        // 供应商联系人
        this.$set(
          this.ruleForm,
          "contractPerson",
          acceptanceCertBO.contractPerson
        );
        // 发货数量
        this.$set(
          this.ruleForm,
          "deliveryCurrentNumber",
          acceptanceCertBO.shipmentsNum
        );
        // 订单编号
        this.$set(this.ruleForm, "orderNumber", acceptanceCertBO.orderNumber);
        // 填报单位
        this.$set(
          this.ruleForm,
          "reportInOrgName",
          acceptanceCertBO.reportInOrgName
        );
        // 供应商
        this.$set(this.ruleForm, "supplier", acceptanceCertBO.supplier);
        // 合同名称
        this.$set(this.ruleForm, "contractName", acceptanceCertBO.contractName);

        // 合同编号
        this.$set(
          this.ruleForm,
          "contractNumber",
          acceptanceCertBO.contractNumber
        );

        // 编制日期
        this.$set(
          this.ruleForm,
          "compileDate",
          new Date(acceptanceCertBO.compileDate.replace(/-/g, "/")).getTime()
        );
        // 编制人
        this.$set(
          this.ruleForm,
          "compilePeople",
          acceptanceCertBO.compilePeople
        );
        // 验收单编号
        this.$set(
          this.ruleForm,
          "acceptanceNumber",
          acceptanceCertBO.acceptanceNumber
        );
        // 验收单名称
        this.$set(
          this.ruleForm,
          "acceptanceName",
          acceptanceCertBO.acceptanceName
        );
        // 订单名称
        this.$set(this.ruleForm, "orderName", acceptanceCertBO.orderName);
        // 供应商联系电话
        this.$set(
          this.ruleForm,
          "supplierPhone",
          acceptanceCertBO.supplierPhone
        );
        // 司机手机号
        this.$set(this.ruleForm, "driverPhone", acceptanceCertBO.driverPhone);

        // 司机姓名
        this.$set(this.ruleForm, "driverName", acceptanceCertBO.driverName);
        // 品牌星级
        this.$set(this.ruleForm, "brandStar", acceptanceCertBO.brandStar);
        // 品牌评价说明
        this.$set(this.ruleForm, "brandState", acceptanceCertBO.brandState);
        // 外观质量星级
        this.$set(
          this.ruleForm,
          "appearanceStar",
          acceptanceCertBO.appearanceStar
        );
        // 外观质量评价说明
        this.$set(
          this.ruleForm,
          "appearanceState",
          acceptanceCertBO.appearanceState
        );
        // 数量星级
        this.$set(this.ruleForm, "numberStar", acceptanceCertBO.numberStar);
        //  数量评价说明
        this.$set(this.ruleForm, "numberState", acceptanceCertBO.numberState);

        this.$set(
          this.ruleForm,
          "logisticsEvaluationStar",
          acceptanceCertBO.logisticsEvaluationStar
        );
        this.$set(
          this.ruleForm,
          "logisticsEvaluationState",
          acceptanceCertBO.logisticsEvaluationState
        );
        this.$set(
          this.ruleForm,
          "logisticsCoordinationStar",
          acceptanceCertBO.logisticsCoordinationStar
        );
        this.$set(
          this.ruleForm,
          "logisticsCoordinationState",
          acceptanceCertBO.logisticsCoordinationState
        );
        // 验收人
        this.$set(this.ruleForm, "acceptor", acceptanceCertBO.acceptor);
        // 验收人联系电话
        this.$set(
          this.ruleForm,
          "acceptancePhone",
          acceptanceCertBO.acceptancePhone
        );

        // 到货地点
        this.$set(this.ruleForm, "arrivalPlace", acceptanceCertBO.arrivalPlace);
        // 车牌号

        this.$set(this.ruleForm, "plateNumber", acceptanceCertBO.plateNumber);

        // 备注
        this.$set(this.ruleForm, "remake", acceptanceCertBO.remake);
        acceptanceBillBOList.forEach(item => {
          item.qingdanId = item.materialId;
          // 验收日期ie回显
          item.acceptanceDate = new Date(
            item.acceptanceDate.replace(/-/g, "/")
          ).getTime();
          item.acceptanceCurrentNumber = formatNumber(
            item.acceptanceCurrentNumber,
            3
          );
          // 验收地点
          item.province = item.provinceCode;
          item.city = item.cityCode;
          item.county = item.countyCode;
          item.deliveryAreaCode = item.areaCode;

          // 拼接地址
          item.testdaohuo =
            item.areaName +
            item.provinceName +
            item.cityName +
            item.countyName +
            item.acceptancePlace;
        });
        this.defalutWuzi = acceptanceBillBOList;
        otherFiles.forEach(item => {
          item.fileClass = "其他";
        });
        sceneFiles.forEach(item => {
          item.fileClass = "现场验收单";
        });
        const fujian = [...otherFiles, ...sceneFiles];
        fujian.forEach(item => {
          new Date(item.uploadTime.replace(/-/g, "/")).getTime();
        });
        fujian.sort((a, b) => {
          return a.sn - b.sn;
        });
        this.defalutFujian = fujian;
        this.isTrue = true;
        this.allLoading = false;
      });
    },

    // 新增时用作回顯
    huixian() {
      const itemData = this.$route.query.data;
      this.allLoading = true;
      getOrder({ id: itemData }).then(res => {
        const { ocOrderBasic } = res.data.data;
        // supplierOrgId 供应商主键id
        // 订单验收
        // 合同id 合同编号 合同名称
        // 订单编号  订单id 订单名称

        // 合同
        // 合同id 合同编号 合同名称

        // 发货
        // 发货单号  发货id 发货名称
        // 合同id 合同编号 合同名称
        // 订单编号  订单id 订单名称

        // 供应商编码
        this.$set(this.ruleForm, "supplierCode", ocOrderBasic.partyBId);
        // 订单主键
        this.$set(this.ruleForm, "orderId", ocOrderBasic.id);

        // 合同ID
        this.$set(this.ruleForm, "contractId", ocOrderBasic.pcConcId);
        // 分类名称
        this.$set(
          this.ruleForm,
          "categoryName",
          ocOrderBasic.thirdCategoriesOfName
        );
        // 供应商ID
        this.$set(this.ruleForm, "supplierOrgId", ocOrderBasic.companyOrgId); // smpPcConc.companyOrgId
        // 供应商联系电话
        this.$set(
          this.ruleForm,
          "supplierPhone",
          ocOrderBasic.contractPersonTel
        );

        // 供应商联系人
        this.$set(this.ruleForm, "contractPerson", ocOrderBasic.contractPerson);

        // 发货数量
        this.$set(
          this.ruleForm,
          "deliveryCurrentNumber",
          ocOrderBasic.shipmentsNum
        );
        // 订单编号
        this.$set(this.ruleForm, "orderNumber", ocOrderBasic.orderNo);
        // 订单名称
        this.$set(this.ruleForm, "orderName", ocOrderBasic.orderName);

        // 填报单位编码
        this.$set(
          this.ruleForm,
          "reportInOrgId",
          JSON.parse(this.$route.query.orgRow).orgId
        );
        // 填报单位
        this.$set(
          this.ruleForm,
          "reportInOrgName",
          JSON.parse(this.$route.query.orgRow).orgName
        );
        // 供应商
        this.$set(
          this.ruleForm,
          "supplier",
          ocOrderBasic.partyBName.toString()
        );
        // 合同名称
        this.$set(
          this.ruleForm,
          "contractName",
          ocOrderBasic.contractName.toString()
        );

        // 合同编号
        this.$set(
          this.ruleForm,
          "contractNumber",
          ocOrderBasic.contractCode.toString()
        );

        // 编制日期
        this.$set(this.ruleForm, "compileDate", new Date().getTime());
        // 编制人
        this.$set(
          this.ruleForm,
          "compilePeople",
          localStorage.getItem("curentUserName")
        );
        // 验收人
        this.$set(
          this.ruleForm,
          "acceptor",
          localStorage.getItem("curentUserName")
        );
        // 验收人联系电话
        this.$set(
          this.ruleForm,
          "acceptancePhone",
          localStorage.getItem("curentUserPhone")
        );
        this.allLoading = false;
      });
    },
    formatDate(date) {
      // date = new Date();
      date = new Date(date); //转换成Data();
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      return y + "-" + m + "-" + d;
    },
    // 清空名称空格
    handleTrim(key) {
      this.$set(
        this.ruleForm,
        key,
        this.ruleForm[key].replace(/(^\s*)|(\s*)$/g, "")
      );
    }
  }
};
</script>

<style lang="scss" scoped>
// 基本信息样式
.relative {
  position: relative;
  .chereay {
    margin-left: 10px;
    position: absolute;
  }
}

.demo-ruleForm {
  width: 80%;
  margin: 20px 0 0 50px;
}
.footerBtn {
  position: fixed;
  bottom: 0;
  z-index: 999;
  width: 93%;
  font-size: 13px;
  line-height: 40px;
  background: #9e9e9e;
  color: #fff;
  text-align: center;
}
.demo-ruleForm {
  margin: 20px 0 70px 50px;
  &::v-deep {
    .el-input input {
      padding-right: 50px;
    }
  }
}
</style>
